//
//  HomeView.swift
//  AppleAppDemo
//
//  Created by 刘忠华 on 2025/9/9.
//

import SwiftUI

struct HomeView: View {
    @EnvironmentObject var focusManager: TVFocusManager
    
    var body: some View {
        Group {
            if PlatformDetector.isTVOS {
                TVScrollViewWrapper(pageIndex: 0) {
                    contentView
                }
                .onAppear {
                    // 首页出现时，确保焦点管理器知道当前在内容区域
                    focusManager.requestContentFocus()
                }
            } else {
                ScrollView {
                    contentView
                }
            }
        }
    }
    
    private var contentView: some View {
        VStack(spacing: PlatformConfig.spacing(for: PlatformDetector.current, base: 24)) {
            // 欢迎标题
            VStack(spacing: PlatformConfig.spacing(for: PlatformDetector.current, base: 20)) {
                Image(systemName: "globe")
                    .imageScale(.large)
                    .foregroundStyle(.tint)
                    .font(.system(size: PlatformConfig.fontSize(for: PlatformDetector.current, base: 80)))
                
                Text("欢迎使用 AppleAppDemo")
                    .font(.system(size: PlatformConfig.fontSize(for: PlatformDetector.current, base: 36)))
                    .fontWeight(.bold)
                    .multilineTextAlignment(.center)
                
                Text("多平台支持演示")
                    .font(.system(size: PlatformConfig.fontSize(for: PlatformDetector.current, base: 24)))
                    .foregroundColor(.secondary)
                    .multilineTextAlignment(.center)
            }
            .padding(.top, PlatformConfig.spacing(for: PlatformDetector.current, base: 16))
            .padding(.bottom, PlatformConfig.spacing(for: PlatformDetector.current, base: 32))
            
            // 平台信息卡片
            PlatformInfoCard()
            
            // 功能特性
            FeaturesGrid()
            
            // 添加更多内容以确保可以滚动
            VStack(alignment: .leading, spacing: PlatformConfig.spacing(for: PlatformDetector.current, base: 8)) {
                Text("更多信息")
                    .font(.title3)
                    .fontWeight(.bold)
                
                VStack(alignment: .leading, spacing: PlatformConfig.spacing(for: PlatformDetector.current, base: 6)) {
                    InfoRow(title: "版本", value: "1.0.0")
                    InfoRow(title: "构建", value: "2025.09.16")
                    InfoRow(title: "开发者", value: "刘忠华")
                    InfoRow(title: "支持平台", value: "iOS, iPadOS, macOS, tvOS")
                }
            }
            .padding(PlatformConfig.spacing(for: PlatformDetector.current, base: 12))
            .background(PlatformConfig.backgroundColor(for: PlatformDetector.current))
            .cornerRadius(PlatformConfig.cornerRadius(for: PlatformDetector.current, base: 8))
            .shadow(color: .black.opacity(0.1), radius: 2, x: 0, y: 1)
            
            // 使用说明
            VStack(alignment: .leading, spacing: PlatformConfig.spacing(for: PlatformDetector.current, base: 32)) {
                Text("使用说明")
                    .font(.system(size: PlatformConfig.fontSize(for: PlatformDetector.current, base: 32)))
                    .fontWeight(.bold)
                    .padding(.bottom, PlatformConfig.spacing(for: PlatformDetector.current, base: 16))
                
                VStack(alignment: .leading, spacing: PlatformConfig.spacing(for: PlatformDetector.current, base: 28)) {
                    InstructionItem(step: "1", text: "使用遥控器上下键浏览内容")
                    InstructionItem(step: "2", text: "点击选择功能或设置")
                    InstructionItem(step: "3", text: "享受多平台一致体验")
                    InstructionItem(step: "4", text: "左右键切换导航选项")
                    InstructionItem(step: "5", text: "长按查看详细信息")
                    InstructionItem(step: "6", text: "按菜单键返回上级页面")
                    InstructionItem(step: "7", text: "使用语音控制进行导航")
                }
            }
            .padding(PlatformConfig.spacing(for: PlatformDetector.current, base: 40))
            .background(PlatformConfig.backgroundColor(for: PlatformDetector.current))
            .cornerRadius(PlatformConfig.cornerRadius(for: PlatformDetector.current, base: 20))
            .shadow(color: .black.opacity(0.2), radius: 12, x: 0, y: 6)
            
            // 添加更多内容来填充黑色区域
            VStack(alignment: .leading, spacing: PlatformConfig.spacing(for: PlatformDetector.current, base: 8)) {
                Text("技术特色")
                    .font(.title3)
                    .fontWeight(.bold)
                
                LazyVGrid(columns: [
                    GridItem(.flexible()),
                    GridItem(.flexible())
                ], spacing: PlatformConfig.spacing(for: PlatformDetector.current, base: 6)) {
                    TechFeatureCard(title: "SwiftUI", icon: "swift", color: .orange)
                    TechFeatureCard(title: "跨平台", icon: "globe", color: .blue)
                    TechFeatureCard(title: "响应式", icon: "arrow.triangle.2.circlepath", color: .green)
                    TechFeatureCard(title: "现代化", icon: "sparkles", color: .purple)
                }
            }
            .padding(PlatformConfig.spacing(for: PlatformDetector.current, base: 12))
            .background(PlatformConfig.backgroundColor(for: PlatformDetector.current))
            .cornerRadius(PlatformConfig.cornerRadius(for: PlatformDetector.current, base: 8))
            .shadow(color: .black.opacity(0.1), radius: 2, x: 0, y: 1)
            
            // 性能展示
            VStack(alignment: .leading, spacing: PlatformConfig.spacing(for: PlatformDetector.current, base: 12)) {
                Text("性能表现")
                    .font(.title2)
                    .fontWeight(.bold)
                
                HStack(spacing: PlatformConfig.spacing(for: PlatformDetector.current, base: 12)) {
                    PerformanceItem(title: "启动", value: "< 1s", color: .green)
                    PerformanceItem(title: "内存", value: "< 50MB", color: .blue)
                    PerformanceItem(title: "响应", value: "< 100ms", color: .orange)
                }
            }
            .padding(PlatformConfig.spacing(for: PlatformDetector.current, base: 16))
            .background(PlatformConfig.backgroundColor(for: PlatformDetector.current))
            .cornerRadius(PlatformConfig.cornerRadius(for: PlatformDetector.current, base: 12))
            .shadow(color: .black.opacity(0.1), radius: 4, x: 0, y: 2)
            
            // 平台特色展示
            VStack(alignment: .leading, spacing: PlatformConfig.spacing(for: PlatformDetector.current, base: 12)) {
                Text("平台特色")
                    .font(.title2)
                    .fontWeight(.bold)
                
                LazyVGrid(columns: [
                    GridItem(.flexible()),
                    GridItem(.flexible()),
                    GridItem(.flexible())
                ], spacing: PlatformConfig.spacing(for: PlatformDetector.current, base: 12)) {
                    PlatformFeatureCard(title: "iOS", icon: "iphone", color: .blue, description: "触控体验")
                    PlatformFeatureCard(title: "iPadOS", icon: "ipad", color: .purple, description: "大屏优化")
                    PlatformFeatureCard(title: "macOS", icon: "macbook", color: .gray, description: "桌面应用")
                    PlatformFeatureCard(title: "tvOS", icon: "tv", color: .orange, description: "遥控操作")
                }
            }
            .padding(PlatformConfig.spacing(for: PlatformDetector.current, base: 16))
            .background(PlatformConfig.backgroundColor(for: PlatformDetector.current))
            .cornerRadius(PlatformConfig.cornerRadius(for: PlatformDetector.current, base: 12))
            .shadow(color: .black.opacity(0.1), radius: 4, x: 0, y: 2)
            
            // 开发工具展示
            VStack(alignment: .leading, spacing: PlatformConfig.spacing(for: PlatformDetector.current, base: 12)) {
                Text("开发工具")
                    .font(.title2)
                    .fontWeight(.bold)
                
                VStack(spacing: PlatformConfig.spacing(for: PlatformDetector.current, base: 8)) {
                    ToolRow(name: "SwiftUI", description: "声明式UI框架", icon: "swift", color: .orange)
                    ToolRow(name: "Xcode", description: "集成开发环境", icon: "hammer", color: .blue)
                    ToolRow(name: "Swift", description: "现代编程语言", icon: "code", color: .green)
                    ToolRow(name: "Simulator", description: "多平台模拟器", icon: "iphone", color: .purple)
                }
            }
            .padding(PlatformConfig.spacing(for: PlatformDetector.current, base: 16))
            .background(PlatformConfig.backgroundColor(for: PlatformDetector.current))
            .cornerRadius(PlatformConfig.cornerRadius(for: PlatformDetector.current, base: 12))
            .shadow(color: .black.opacity(0.1), radius: 4, x: 0, y: 2)
            
            Spacer(minLength: PlatformConfig.spacing(for: PlatformDetector.current, base: 20))
        }
        .padding(.horizontal, PlatformConfig.spacing(for: PlatformDetector.current, base: 8))
        .navigationTitle("首页")
        #if os(iOS)
        .navigationBarTitleDisplayMode(.large)
        #endif
    }
}

/// 平台信息卡片
struct PlatformInfoCard: View {
    private var backgroundColor: Color {
        return PlatformConfig.backgroundColor(for: PlatformDetector.current)
    }
    
    var body: some View {
        VStack(alignment: .leading, spacing: PlatformConfig.spacing(for: PlatformDetector.current, base: 8)) {
            HStack {
                Image(systemName: platformIcon)
                    .foregroundColor(.blue)
                    .font(.title3)
                
                Text("当前平台")
                    .font(.headline)
                    .fontWeight(.semibold)
                
                Spacer()
            }
            
            VStack(alignment: .leading, spacing: PlatformConfig.spacing(for: PlatformDetector.current, base: 4)) {
                Text("平台: \(PlatformDetector.current.displayName)")
                    .font(.subheadline)
                
                Text("设备类型: \(deviceTypeDescription)")
                    .font(.subheadline)
                    .foregroundColor(.secondary)
                
                Text("输入方式: \(inputMethodDescription)")
                    .font(.subheadline)
                    .foregroundColor(.secondary)
            }
        }
        .padding(PlatformConfig.spacing(for: PlatformDetector.current, base: 12))
        .background(backgroundColor)
        .cornerRadius(PlatformConfig.cornerRadius(for: PlatformDetector.current, base: 12))
        .shadow(color: .black.opacity(0.1), radius: 4, x: 0, y: 2)
    }
    
    private var platformIcon: String {
        switch PlatformDetector.current {
        case .iOS: return "iphone"
        case .iPadOS: return "ipad"
        case .macOS: return "desktopcomputer"
        case .tvOS: return "tv"
        }
    }
    
    private var deviceTypeDescription: String {
        if PlatformDetector.current.isMobile {
            return "移动设备"
        } else if PlatformDetector.current.isDesktop {
            return "桌面设备"
        } else if PlatformDetector.current.isTV {
            return "电视设备"
        }
        return "未知设备"
    }
    
    private var inputMethodDescription: String {
        var methods: [String] = []
        
        if PlatformDetector.current.supportsTouch {
            methods.append("触控")
        }
        if PlatformDetector.current.supportsMouse {
            methods.append("鼠标")
        }
        if PlatformDetector.current.supportsRemote {
            methods.append("遥控器")
        }
        
        return methods.joined(separator: "、")
    }
}

/// 功能特性网格
struct FeaturesGrid: View {
    private let features = [
        FeatureItem(title: "多平台支持", description: "一套代码，多端运行", icon: "globe"),
        FeatureItem(title: "自适应UI", description: "根据平台自动调整", icon: "rectangle.3.group"),
        FeatureItem(title: "原生体验", description: "充分利用平台特性", icon: "star.fill"),
        FeatureItem(title: "统一维护", description: "代码集中管理", icon: "wrench.and.screwdriver")
    ]
    
    var body: some View {
        VStack(alignment: .leading, spacing: PlatformConfig.spacing(for: PlatformDetector.current, base: 8)) {
            Text("功能特性")
                .font(.title3)
                .fontWeight(.bold)
            
            LazyVGrid(columns: gridColumns, spacing: PlatformConfig.spacing(for: PlatformDetector.current, base: 8)) {
                ForEach(features, id: \.title) { feature in
                    FeatureCard(feature: feature)
                }
            }
        }
    }
    
    private var gridColumns: [GridItem] {
        let columnCount = PlatformDetector.isTV ? 2 : (PlatformDetector.isMacOS ? 3 : 2)
        return Array(repeating: GridItem(.flexible()), count: columnCount)
    }
}

/// 功能项目
struct FeatureItem {
    let title: String
    let description: String
    let icon: String
}

/// 功能卡片
struct FeatureCard: View {
    let feature: FeatureItem
    
    private var backgroundColor: Color {
        return PlatformConfig.backgroundColor(for: PlatformDetector.current)
    }
    
    var body: some View {
        VStack(spacing: PlatformConfig.spacing(for: PlatformDetector.current, base: 6)) {
            Image(systemName: feature.icon)
                .font(.system(size: PlatformConfig.fontSize(for: PlatformDetector.current, base: 24)))
                .foregroundColor(.blue)
            
            Text(feature.title)
                .font(.subheadline)
                .fontWeight(.semibold)
                .multilineTextAlignment(.center)
            
            Text(feature.description)
                .font(.caption)
                .foregroundColor(.secondary)
                .multilineTextAlignment(.center)
        }
        .padding(PlatformConfig.spacing(for: PlatformDetector.current, base: 8))
        .frame(maxWidth: .infinity)
        .background(backgroundColor)
        .cornerRadius(PlatformConfig.cornerRadius(for: PlatformDetector.current, base: 8))
        .shadow(color: .black.opacity(0.1), radius: 2, x: 0, y: 1)
    }
}

/// 信息行
struct InfoRow: View {
    let title: String
    let value: String
    
    var body: some View {
        HStack {
            Text(title)
                .font(.subheadline)
                .foregroundColor(.secondary)
            
            Spacer()
            
            Text(value)
                .font(.subheadline)
                .fontWeight(.medium)
        }
    }
}

/// 说明项目
struct InstructionItem: View {
    let step: String
    let text: String
    
    var body: some View {
        HStack(alignment: .top, spacing: PlatformConfig.spacing(for: PlatformDetector.current, base: 24)) {
            Text(step)
                .font(.system(size: PlatformConfig.fontSize(for: PlatformDetector.current, base: 28)))
                .fontWeight(.bold)
                .foregroundColor(.white)
                .frame(width: PlatformConfig.fontSize(for: PlatformDetector.current, base: 60), height: PlatformConfig.fontSize(for: PlatformDetector.current, base: 60))
                .background(Color.blue)
                .clipShape(Circle())
            
            Text(text)
                .font(.system(size: PlatformConfig.fontSize(for: PlatformDetector.current, base: 24)))
                .foregroundColor(.primary)
                .multilineTextAlignment(.leading)
                .lineLimit(nil)
            
            Spacer()
        }
        .padding(PlatformConfig.spacing(for: PlatformDetector.current, base: 24))
        .frame(minHeight: PlatformConfig.fontSize(for: PlatformDetector.current, base: 120))
        .background(PlatformConfig.backgroundColor(for: PlatformDetector.current).opacity(0.7))
        .cornerRadius(PlatformConfig.cornerRadius(for: PlatformDetector.current, base: 16))
        .shadow(color: .black.opacity(0.15), radius: 4, x: 0, y: 2)
    }
}

/// 技术特色卡片
struct TechFeatureCard: View {
    let title: String
    let icon: String
    let color: Color
    
    private var backgroundColor: Color {
        return PlatformConfig.backgroundColor(for: PlatformDetector.current)
    }
    
    var body: some View {
        VStack(spacing: PlatformConfig.spacing(for: PlatformDetector.current, base: 4)) {
            Image(systemName: icon)
                .font(.system(size: PlatformConfig.fontSize(for: PlatformDetector.current, base: 20)))
                .foregroundColor(color)
            
            Text(title)
                .font(.caption)
                .fontWeight(.medium)
                .multilineTextAlignment(.center)
        }
        .padding(PlatformConfig.spacing(for: PlatformDetector.current, base: 8))
        .frame(maxWidth: .infinity)
        .background(backgroundColor)
        .cornerRadius(PlatformConfig.cornerRadius(for: PlatformDetector.current, base: 6))
        .shadow(color: .black.opacity(0.1), radius: 1, x: 0, y: 1)
    }
}

/// 性能项目
struct PerformanceItem: View {
    let title: String
    let value: String
    let color: Color
    
    var body: some View {
        VStack(spacing: PlatformConfig.spacing(for: PlatformDetector.current, base: 4)) {
            Text(value)
                .font(.title3)
                .fontWeight(.bold)
                .foregroundColor(color)
            
            Text(title)
                .font(.caption)
                .foregroundColor(.secondary)
        }
        .frame(maxWidth: .infinity)
        .padding(PlatformConfig.spacing(for: PlatformDetector.current, base: 12))
        .background(color.opacity(0.1))
        .cornerRadius(8)
    }
}

/// 平台特色卡片
struct PlatformFeatureCard: View {
    let title: String
    let icon: String
    let color: Color
    let description: String
    
    var body: some View {
        VStack(spacing: PlatformConfig.spacing(for: PlatformDetector.current, base: 8)) {
            Image(systemName: icon)
                .font(.system(size: PlatformConfig.fontSize(for: PlatformDetector.current, base: 32)))
                .foregroundColor(color)
            
            Text(title)
                .font(.headline)
                .fontWeight(.bold)
            
            Text(description)
                .font(.caption)
                .foregroundColor(.secondary)
                .multilineTextAlignment(.center)
        }
        .padding(PlatformConfig.spacing(for: PlatformDetector.current, base: 12))
        .frame(maxWidth: .infinity)
        .background(PlatformConfig.backgroundColor(for: PlatformDetector.current))
        .cornerRadius(PlatformConfig.cornerRadius(for: PlatformDetector.current, base: 8))
        .shadow(color: .black.opacity(0.1), radius: 2, x: 0, y: 1)
    }
}

/// 工具行
struct ToolRow: View {
    let name: String
    let description: String
    let icon: String
    let color: Color
    
    var body: some View {
        HStack(spacing: PlatformConfig.spacing(for: PlatformDetector.current, base: 12)) {
            Image(systemName: icon)
                .font(.system(size: PlatformConfig.fontSize(for: PlatformDetector.current, base: 24)))
                .foregroundColor(color)
                .frame(width: PlatformConfig.fontSize(for: PlatformDetector.current, base: 32))
            
            VStack(alignment: .leading, spacing: PlatformConfig.spacing(for: PlatformDetector.current, base: 2)) {
                Text(name)
                    .font(.headline)
                    .fontWeight(.medium)
                
                Text(description)
                    .font(.subheadline)
                    .foregroundColor(.secondary)
            }
            
            Spacer()
        }
        .padding(PlatformConfig.spacing(for: PlatformDetector.current, base: 12))
        .background(PlatformConfig.backgroundColor(for: PlatformDetector.current))
        .cornerRadius(PlatformConfig.cornerRadius(for: PlatformDetector.current, base: 8))
        .shadow(color: .black.opacity(0.05), radius: 1, x: 0, y: 1)
    }
}

#Preview {
    NavigationView {
        HomeView()
    }
}